import { Component, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { DataService } from '../../service/data.service';
import { SettingComponent } from 'src/app/components/setting/setting.component';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
  @ViewChild('setting') setting:SettingComponent
  selectorClass = 'recommend'
  windowHeight:number = window.innerHeight
  menuHeight:number = 0
  constructor(private router:Router, private dataService:DataService) { }

  ngOnInit(): void {
    this.menuHeight = this.windowHeight - 150
    this.setSelectorClass()
    this.router.events.pipe().subscribe(route => {
      this.setSelectorClass()
    });
  }
  setSelectorClass(){
    let url:string = this.router.url.toString()
    if(url.match('/homeCook')){
      this.selectorClass = 'homeCook'
    }
    else if(url.match('/snack')){
      this.selectorClass = 'snack'
    }
    else if(url.match('/pastry')){
      this.selectorClass = 'pastry'
    }
    else{
      this.selectorClass = 'recommend'
    }
  }
  toRecommend(){
    this.router.navigate(['./'])
  }
  toHomeCook(){
    this.router.navigate(['./homeCook'])
  }
  toSet(){
    this.setting.out()
  }
}
